<template>
    <div>
        <el-input :title="currentObject.name" readonly placeholder="请选择" @click.native="show" :value="currentObject.name">
            <i class="el-icon-circle-plus-outline color-primary" slot="suffix"></i>
        </el-input>
        <el-dialog title="选择合同" :visible.sync="isShow" width="500px" class="usable-area" @close="cancel" v-dialogDrag
                   append-to-body>
            <el-table :data="hpclist" :isPaging="false">
                <el-table-column label="#" show-overflow-tooltip width="30">
                    <template slot-scope="scope">
                        <el-radio v-model="currentData" :label="scope.row">&nbsp;</el-radio>
                    </template>
                </el-table-column>
                <el-table-column label="合同编号" show-overflow-tooltip min-width="170">
                    <template slot-scope="scope">
                        <div class="ml5">{{scope.row.code}}</div>
                    </template>
                </el-table-column>
                <el-table-column label="合同名称">
                    <template slot-scope="scope">
                        <div>{{scope.row.name}}</div>
                    </template>
                </el-table-column>
            </el-table>

            <el-pagination :current-page="pageInfo.pagenum" :page-sizes="[5]" :page-size="pageInfo.pagesize" :total ="pageInfo.totalCount"
			        @current-change="handleCurrentChange" layout="total, sizes, prev, pager, next, jumper" background >
			</el-pagination>
            <span slot="footer" class="dialog-footer">
                <el-button class="font12" @click="cancel" size="small">取 消</el-button>
                <el-button type="primary" @click="confirm" size="small">确
                    定</el-button>
            </span>
        </el-dialog>
    </div>

</template>
<script>
export default {
    data() {
        return {
            pageInfo: {
                currPage: 0,
                pageSize: 0,
                totalCount: 0,
                totalPage: 0
            },
            queryInfo: {
                limit: 5,
                page: 1,
            },
            currentData: '',
            currentObject: '',
            isShow: false,
            hpclist: []
        };
    },
    created() {
        this.getList();
    },
    methods: {
        async getList() {
            const { data: res } = await this.$http.get("contract/list", {params: this.queryInfo});
            if (res.code !== 200) {
                return this.$message.error("获取数据失败！");
            }
            this.total = res.data.totalPage;
            this.pageInfo.currPage = res.data.currPage;
            this.pageInfo.pageSize = res.data.pageSize;
            this.pageInfo.totalCount = res.data.totalCount;
            this.pageInfo.totalPage = res.data.totalPage;
            this.hpclist = res.data.list;
        },
        show() {
            this.isShow = true;
        },
        hide() {
            this.isShow = false;
        },
        cancel() {
            this.hide();
        },
        handleCurrentChange(newPage) {
		    this.queryInfo.page = newPage
		    this.getList()
	    },

        confirm() {
            this.currentObject = this.currentData;
            this.$emit('getData', this.currentObject.id);
            this.cancel();
        }
    }
};
</script>
<style lang="less" scoped>
</style>